<template>

<view class="house">
	<image class="house1" src="/static/WD_美图抠图20240710.png(1).png"></image>
</view>

<view class="choose">
<view class="choose1">
	<navigator url="/pages/branch1/animal" >
		<image class="animal" src="../../static/分组 3(1).png"></image>
	</navigator>
</view>
<view class="choose2">
	<navigator url="/pages/branch1/food">
		<image class="food2" src="/static/分组 1 (7)(1).png"></image>
	</navigator>
</view>
<view class="choose3">
	<navigator url="/pages/branch1/tool">
		<image class="tool2" src="../../static/分组 2(1).png"></image>
	</navigator>
</view>
</view>
</template>

<script>
	export default {
		onLoad() {
	
		},
		methods: {
	
		}
	}
</script>

<style>
	.choose{
		display: flex;
        flex-direction:column;
		align-items: center;
		padding: 20px;
	}
	.house{
		grid-row: 1;
	}
	.house1{
		border: 0rpx;
		left: 0rpx;
		top: 0rpx;
		width: 316rpx;
		height: 271rpx;
		opacity: 1;
	    position:absolute;
	}
	.choose1{
		display: flex;
        justify-content: center;
		align-items: center;
	}
	.animal{
		position: absolute;
		top:156rpx;
		width: 228px;
		height: 159rpx;
		left: 140rpx;
	}
	.choose2{
		position: fixed;
        top: 190px;
	}
	.food2{
		width: 228px;
		height: 159rpx;
		left: 140rpx;
	}
		
	.choose3{
		position: fixed;
		top: 300px;
	}
	.tool2{
		width: 228px;
		height: 159rpx;
		left: 140rpx;
	}
</style>